import React, { useState } from 'react';
import { Modal, Button, Space } from 'antd';
import { t } from '@/locales/i18n';
import ConsultationStatisticsBar from './ConsultationStatisticsBar';
import {
  userActiveItem, highschoolconsultations
} from '@/common/types';

interface DeleteConfirmModalProps {
  visible: boolean;
  loading?: boolean;
  text: string | React.ReactNode;
  onCancel: () => void;
  onConfirm: () => void;
  onCancelText?: string; // 可选参数
  onConfirmText?: string; // 可选参数
  data?: highschoolconsultations[]
}

const DeleteConfirmModal: React.FC<DeleteConfirmModalProps> = ({
  visible,
  loading = false,
  text,
  onCancel,
  onConfirm,
  onCancelText = t('page.homePage.cancel'), // 默认值
  onConfirmText = t('page.homePage.del'), // 默认值
  data
}) => {

  const [userActiveData, setUserActiveData] = useState<userActiveItem[]>([{ name: "1", value: 10 }, { name: "1", value: 10 }, { name: "1", value: 10 }, { name: "1", value: 10 }, { name: "1", value: 10 }]);
  return (
    <Modal
      open={visible}
      onCancel={onCancel}
      closable={false}
      width={1400}

      footer={
        <div style={{ textAlign: 'center', display: "none" }}>
          <Space size={30}>
            <Button onClick={onCancel}>{onCancelText}</Button>
            <Button type="primary" danger loading={loading} onClick={onConfirm}>
              {onConfirmText}
            </Button>
          </Space>
        </div>
      }
    >
      <div
        style={{
          display: 'flex',
          flexDirection: 'column',
          justifyContent: 'center',
          alignItems: 'center',
          height: "500px",

        }}
      >
        <div className='w-full'>{text}</div>
        <ConsultationStatisticsBar isdataZoom={true} data={data} />
      </div>
    </Modal>
  );
};

export default DeleteConfirmModal;
